$(document).ready(function(){
    ajaxList();
});



$("#province").on("change",function () {
    var city = $("#province").val();
    $("#area").html("");
    var html = " <option value=''>全部</option>";
    $("#area").append(html);
    getCity(city);
})
$("#city").on("change",function () {
    var city = $("#city").val();
    getArea(city);
})
function getCity(city){
    $.ajax({
        url: '/dog/city',
        data: {city: city},
        type: 'POST',
        dataType: 'json',//返回的数据类型
        success: function (data) {
            var cityArray =  data.cityArray;
            $("#city").html("");
            var html = " <option value=''>全部</option>";
            $.each(cityArray, function (i, item) {
                html += "<option value='"+item.district_id+"'>" + item.district + "</option>";
            });
            $("#city").append(html);
        }
    })
}
function getArea(area){
    $.ajax({
        url: '/dog/area',
        data: {area: area},
        type: 'POST',
        dataType: 'json',//返回的数据类型
        success: function (data) {
            var cityArray =  data.cityArray;
            $("#area").html("");
            var html = " <option value=''>全部</option>";
            $.each(cityArray, function (i, item) {
                html += "<option value='"+item.district_id+"'>" + item.district + "</option>";
            });
            $("#area").append(html);
        }
    })
}

$(".search").click(function () {
    var data = $("#searchform").serialize();
    var start = $('.start_time').val();
    var end = $('.end_time').val();
    if(start==''||end==''){
        dshow('时间不能为空');
        return false
    }
    if(start > end){
        dshow('结束时间必须大于开始时间');
        return false
    }
    ajaxList(data);
});

function ajaxList(data) {
    $.ajax({
        url: '/dog/echartsList',
        data: data,
        type: 'POST',
        dataType: 'json',//返回的数据类型
        success: function (data) {
            sex(data.totalName.sex,'main1',data.totalNum.sex);
            sex(data.totalName.age,'main2',data.totalNum.age);
            sex(data.totalName.size,'main3',data.totalNum.size);
            sex(data.totalName.vaccine,'main4',data.totalNum.vaccine);
            sex(data.totalName.outside,'main5',data.totalNum.outside);
            sex(data.totalName.inside,'main6',data.totalNum.inside);
            sex(data.totalName.sterilization,'main7',data.totalNum.sterilization);
            sex(data.totalName.disability,'main8',data.totalNum.disability);

        }
    })
}


function sex(name,idClass,data) {
    var myChart1 = echarts.init(document.getElementById(idClass));
    option = {
        title : {
            text: name,
            x:'center'
        },
        // tooltip : {
        //     trigger: 'item',
        //     formatter: "{a} <br/>{b} : {c} ({d}%)"
        // },

        series : [
            {
                type: 'pie',
                radius : '55%',
                center: ['50%', '60%'],
                data:data,
                itemStyle: {
                    emphasis: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                },
                label : {
                    normal : {
                        formatter: '{b}: ({d}%)',
                        textStyle : {
                            fontWeight : 'normal',
                            fontSize : 15
                        }
                    }
                }
            }
        ]
    };
    myChart1.setOption(option);
}


